﻿<!DOCTYPE HTML>
<html>
<head>
<title>博客</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href='http//fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<script src="js/jquery.min.js"></script>
<!---start-login-script--->
		<script src="js/login.js"></script>
		<!---//End-login-script--->
		<!-----768px-menu----->
		<link type="text/css" rel="stylesheet" href="css/jquery.mmenu.all.css" />
		<script type="text/javascript" src="js/jquery.mmenu.js"></script>
			<script type="text/javascript">
				//	The menu on the left
				$(function() {
					$('nav#menu-left').mmenu();
				});
		</script>
		<!-----//768px-menu----->
</head>
<body>
		<div class="content">
	<!------start-768px-menu---->
			<div id="page">
				<div id="header">
					<a class="navicon" href="#menu-left"> </a>
				</div>
				<nav id="menu-left">
					<ul>
						<li ><a href="index.html">首页</a></li>
						<li><a href="about.html">关于</a></li>
						<li class="active"><a href="blog.html">博客</a></li>
						<div class="clear"> </div>
					</ul>
				</nav>
			</div>
		<!------end-768px-menu---->
			<!---start-header---->
			<div class="header">
		   <!---start-wrap---->
				<div class="wrap">
				<div class="header-left">
					<div class="logo">
						<a href="index.html"><img src="images/logo.jpg"/></a>
					</div>
				</div>
				<div class="header-right">
					<div class="top-nav">
					<ul>
						<li><a href="index.html">首页</a></li>
						<li><a href="about.html">关于</a></li>
						<li class="active"><a href="blog.html">博客</a></li>
					</ul>
				</div>
				
				<div class="sign-ligin-btns">
					<ul>
						<li id="loginContainer"><a class="login" id="loginButton" href="#"><span>登录</span></a>
							<div class="clear"> </div>
							<div id="loginBox">
								<form id="loginForm">
									<fieldset id="body">
										<fieldset>
											<label for="email">邮箱号</label>
											<input type="text" name="email" id="email" />
										</fieldset>
										<fieldset>
											<label for="password">密码</label>
											<input type="password" name="password" id="password" />
										</fieldset>
										<label class="remeber" for="checkbox"><input type="checkbox" id="checkbox" />记住我</label>
										<input type="submit" id="login" value="登录" />
									</fieldset>
									<span><a href="#">忘记密码？</a></span>
								</form>
							</div>
							<!-- Login Ends Here -->
						</li>
						<li id="signupContainer"><a class="signup" id="signupButton" href="#"><span>注册</span></a>
							<div class="clear"> </div>
							<div id="signupBox">
								<form id="signupForm">
									<fieldset id="signupbody">
										<fieldset>
											<label for="email">邮箱号 <span>*</span></label>
											<input type="text" name="email" id="signupemail" />
										</fieldset>
										<fieldset>
											<label for="password">请您输入密码<span>*</span></label>
											<input type="password" name="password" id="signuppassword" />
										</fieldset>
										<fieldset>
											<label for="password">请您再次输入密码<span>*</span></label>
											<input type="password" name="password" id="signuppassword1" />
										</fieldset>
										<input type="submit" id="signup" value="现在注册!" />
									</fieldset>
								</form>
							</div>
							<!-- Login Ends Here -->
						</li>
						<div class="clear"> </div>
					</ul>
				</div>
				<div class="clear"> </div>
				</div>
				<div class="clear"> </div>
			</div>
			</div>
			<div class="wrap">
				<div class="section-title">
	                   <h3>博客</h3>
	            </div><!--section-title-->
			</div>
		</div>
<div class="main_bg">
	 <p class="about-title">欢迎来到我的博客！</p>
<div class="wrap">
 <div class="blog">
 	<!-- start main_content -->
	<div class="blog_left">
				<h3 class="style"><a href="#">只写了很少的文章哦！</a></h3>
				<div class="blog-img"><a href="details.html"><img src="images/blog-img1.jpg" alt=""></a></div>
			     <div class="blog_grid">
					<div class="span_1_of_blog">
					   <ul class="blog-list">
					   	 <li>发表于<br>2017-10-24</li>
					   	 <li>标题<br><a href="#">网站</a>&nbsp; | &nbsp; <a href="#">设计</a></li>
					   	 <li>评论<br><a href="details.html">8</a></li>
					   </ul>
				     </div>
					 <div class="span_2_of_blog">
					   <p class="para">您懂的。我还没有写文章。</p>
					   <p class="para">文章正文</p>
					 </div>	
					 <div class="clear"></div>			
		     	</div>
		     	<div class="blog_main">
				<h3 class="style"><a href="#">第二篇文章</a></h3>
				<div class="blog-img"><a href="details.html"><img src="images/blog-img2.png" alt=""></a></div>
			     <div class="blog_grid">
					<div class="span_1_of_blog">
					   <ul class="blog-list">
						   <li>发表于<br>2017-10-24</li>
						   <li>标题<br><a href="#">网站</a>&nbsp; | &nbsp; <a href="#">设计</a></li>
						   <li>评论<br><a href="details.html">8</a></li>
					   </ul>
				     </div>
					 <div class="span_2_of_blog">
						 <p class="para">您懂的。我还没有写文章。</p>
						 <p class="para">文章正文</p>
					 </div>
					 <div class="clear"></div>			
		     	</div>
		     	</div>
    </div>
	<div class="rsidebar span_1_of_3">
				<div class="search_box">
					<form>
					   <input type="text" value="搜索。。。" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Search';}"><input type="submit" value="">
				    </form>
			 	</div>
               <div class="social_2">	
               	<h4>跟随我</h4>
	           <ul>	
				    <li class="facebook"><a href="#"><span> </span></a></li>
				    <li class="twitter"><a href="#"><span> </span></a></li>	 	
					<li class="google"><a href="#"><span> </span></a></li>
			  </ul>
		 	  </div>
               <div class="email_box">
					<form>
						<div class="email">
					  		 <input type="text" value="您的邮箱" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Enter Your e-mail';}">
					  	</div>
					  	 <div class="button">
						   	 <span><input type="submit" value="订阅"></span>
						</div>
				    </form>
			 	</div>
			 	<div class="Categories">
			 		<h4>分类</h4>
				 	<ul class="sidebar">
			           	<div class="hover"><li><a href="#">网站</a></li></div>
			            <div class="hover"><li><a href="#">java</a></li></div>
						<div class="hover"><li><a href="#">服务器</a></li></li></div>
			          </ul>
		        </div>
		        <div class="recentpost">
			 		<h4>最近贴文</h4>
				 	<ul class="sidebar_1">
			           	<li><a href="http://blog.csdn.net/itwangyang520/article/details/78274915">margin和padding的高级用法</a></li>
			            <li><a href="http://blog.csdn.net/itwangyang520/article/details/78274915">margin和padding的高级用法</a></li>
			           	<li><a href="http://blog.csdn.net/itwangyang520/article/details/78274915">margin和padding的高级用法</a></li>
			          </ul>
		        </div>
		        <div class="tags">
		        	<h4>标签</h4>
		        	<ul>
		        		<li><a href="#">设计</a></li>
		        		<li><a href="#">开发</a></li>
		        		<li><a href="#">多用途</a></li>
		        		<li><a href="#">创作</a></li>
		        		<li><a href="#">搜索引擎优化</a></li>
		        		<li><a href="#">IT</a></li>
		        		<div class="clear"> </div>
		        	</ul>
		        </div>
		</div>
	<div class="clear"></div>
	<!-- end main_content -->
</div>
</div>
</div>

<!-- start footer -->
		<div class="footer">
			<div class="wrap">
				<div class="footer-left">
					<div class="copy">
						<p>Copyright &copy; 2017.Company name All rights reserved.<a target="_blank" href="http://itwangyang.xyz">itwang</a></p>
					</div>
				</div>
				<div class="social_icons">
					<ul>
						<li class="in"><a href="#"><span> </span></a></li>
						<li class="pro"><a href="#"><span> </span></a></li>
						<li class="twitter"><a href="#"><span> </span></a></li>
						<li class="facebook"><a href="#"><span> </span></a></li>
						<div class="clear"> </div>
					</ul>
				</div>
				<div class="clear"> </div>
			</div>

		</div>
</body>
</html>